<ix-modal-header
  [title]="'Global Settings' | translate"
  [requiredRoles]="requiredRoles"
  [loading]="isLoading()"
></ix-modal-header>

<mat-card>
  <mat-card-content>
    <form class="ix-form-container" [formGroup]="form" (submit)="onSubmit()">
      <ix-fieldset [title]="'Storage' | translate">
        <ix-checkbox
          formControlName="pool"
          [label]="'Enabled' | translate"
        ></ix-checkbox>

        @if (form.controls.pool.value) {
          <ix-select
            formControlName="storage_pools"
            [label]="'Pools' | translate"
            [multiple]="true"
            [options]="poolOptions$"
          ></ix-select>
        }
      </ix-fieldset>

      <ix-fieldset [title]="'Default Network' | translate">
        <ix-select
          formControlName="bridge"
          [label]="'Bridge' | translate"
          [required]="true"
          [options]="bridgeOptions$"
        ></ix-select>

        @if (isAutoBridge) {
          <ix-ip-input-with-netmask
            formControlName="v4_network"
            [label]="'IPv4 Network' | translate"
            [hint]="'Leave empty for default values' | translate"
          ></ix-ip-input-with-netmask>

          <ix-ip-input-with-netmask
            formControlName="v6_network"
            [label]="'IPv6 Network' | translate"
            [hint]="'Leave empty for default values' | translate"
          ></ix-ip-input-with-netmask>
        }
      </ix-fieldset>

      <ix-form-actions>
        <button
          *ixRequiresRoles="requiredRoles"
          mat-button
          type="submit"
          color="primary"
          ixTest="save"
          [disabled]="form.invalid || isLoading()"
        >
          {{ 'Save' | translate }}
        </button>
      </ix-form-actions>
    </form>
  </mat-card-content>
</mat-card>
